<script lang="ts" setup>
import { useAdminPayStore } from "../store/adminPay"

const { wechatPay, common } = useAdminPayStore()
</script>

<template>
  <t-row v-show="common.showType === '1'" style="width: 100%;">
    <t-col :lg="5" :md="6" :sm="12" :xl="5" :xs="12">
      <t-space class="left_space" direction="vertical">
        <t-form :data="wechatPay.formData" label-align="right" label-width="70px">

          <t-form-item label="商户号">
            <t-input v-model="wechatPay.formData.mchid" placeholder="请输入商户号" />
          </t-form-item>

          <t-form-item label="AppID">
            <t-input v-model="wechatPay.formData.appid" placeholder="请输入绑定小程序或公众号的AppID" />
          </t-form-item>

          <t-form-item label="APIv3秘钥">
            <t-input v-model="wechatPay.formData.api_key_v3" placeholder="请输入32位APIv3秘钥" type="password" />
          </t-form-item>

          <t-form-item label="证书序列号">
            <t-input v-model="wechatPay.formData.serial_number" placeholder="请输入平台证书序列号"
                     type="password" />
          </t-form-item>

          <t-form-item label="商家私钥">
            <t-textarea v-model="wechatPay.formData.private_key" :autosize="{ minRows: 2, maxRows: 3 }"
                        placeholder="请输入商家秘钥 apiclient_key.pem" type="password" />
          </t-form-item>

          <t-form-item label="是否开启">
            <t-switch v-model="wechatPay.formData.status" :customValue="[1,0]" />
          </t-form-item>

        </t-form>
      </t-space>
    </t-col>
    <t-col :lg="7" :md="6" :sm="12" :xl="7" :xs="12" class="right">
      <img alt="" class="img" src="@/assets/images/pay_set.svg" />
    </t-col>
  </t-row>

</template>

<style lang="less" scoped>
.left_space {
  width: 100%;
  padding: 20px;
  box-sizing: border-box;
}

.right {
  display: flex;
  justify-content: center;
  align-items: center;

  img {
    width: 50%;
  }
}
</style>
